<template>
  <EditOrViewTable :table-data="tableData" :type="type" :setting="setting" :add-hook="comAddHook" :hidden-column="hiddenColumn" :editable-column="editableColumn" :diseditable-column="diseditableColumn" />
</template>
<script>
import EditOrViewTable from './editOrViewTable'
const requiredKeys = {
  fromAccountCode: '原业务账号编码',
  toAccountCode: '现业务账号编码',
  fromShopCode: '原门店编码',
  relationName: '新老商家关系',
  afterServiceAccount: '售后问题负责人',
  reason: '交接原因',
  isTransferSales: '销量是否转让',
  rebatepRoblem: '返利对象',
  isContinuePromotion: '是否延续促销活动',
  isTransferBalance: '余额是否转让',
  isTransferDeposit: '经营保证金是否转让'
}
export default {
  name: 'DistributionTable',
  components: {
    EditOrViewTable
  },
  props: {
    tableData: {
      type: Array,
      default: () => []
    },
    type: {
      type: String,
      default: 'view'
    },
    officeCode: {
      type: String,
      default: ''
    },
    customerCode: {
      type: String,
      default: ''
    },
    editableColumn: {
      type: Array,
      default: () => []
    },
    diseditableColumn: {
      type: Array,
      default: () => []
    },
    hiddenColumn: {
      type: Array,
      default: () => []
    },
    title: {
      type: String,
      default: ''
    },
    // 是否过滤全友轻居客户
    filterQYQJKU: {
      type: Boolean,
      default: false
    },
    // 是否是审核
    isAudit: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      setting: [
        {
          prop: 'fromCustomerCode',
          label: '原商家编码',
          required: false,
          minWidth: 200,
          editRender: (h, row) => {
            return h('c-common-search-customer-cooperation-end', {
              props: {
                value: row.fromCustomerCode,
                label: row.fromCustomerName,
                formatLabel: v => v.customerCode,
                disabled: !this.officeCode,
                officeCode: this.officeCode,
                filtersRaw: []
              },
              on: {
                input: v => {
                  this.$set(row, 'fromCustomerCode', v)
                  this.$set(row, 'fromAccountCode', '')
                  this.$set(row, 'fromAccountName', '')
                  this.$nextTick(() => {
                    this.$emit('on-customer-change', this.tableData.map(e => e.fromCustomerCode).filter(e => !!e))
                  })
                },
                'update:label': v => this.$set(row, 'fromCustomerName', v)
              },
              nativeOn: {
                click: e => e.stopPropagation()
              }
            })
          }
        },
        {
          prop: 'fromCustomerName',
          label: '原商家名称',
          minWidth: 150
        },
        {
          prop: 'fromAccountCode',
          label: '原业务账号编码',
          required: false,
          minWidth: 200,
          editRender: (h, row) => {
            return h('c-common-search-account-by-customer', {
              props: {
                value: row.fromAccountCode,
                label: row.fromAccountName,
                formatLabel: v => v.accountCode,
                disabled: !row.fromCustomerCode,
                customerCode: row.fromCustomerCode,
                exclude: [row.toAccountCode]
              },
              on: {
                input: v => {
                  this.$set(row, 'fromAccountCode', v)
                  this.$set(row, 'fromShopCode', '')
                  this.$set(row, 'fromShopName', '')
                },
                'update:label': v => this.$set(row, 'fromAccountName', v)
              },
              nativeOn: {
                click: e => e.stopPropagation()
              }
            })
          }
        },
        {
          prop: 'fromAccountName',
          label: '原业务账号名称',
          minWidth: 150
        },
        // 门店新建
        {
          prop: 'fromShopCode',
          label: '原门店编码',
          required: false,
          minWidth: 200,
          editRender: (h, row) => {
            return h('c-common-search-shop-by-account', {
              props: {
                value: row.fromShopCode,
                label: row.fromShopName,
                formatLabel: v => v.code,
                disabled: !row.fromAccountCode,
                account: row.fromAccountCode
              },
              on: {
                input: v => this.$set(row, 'fromShopCode', v),
                'update:label': v => this.$set(row, 'fromShopName', v)
              },
              nativeOn: {
                click: e => e.stopPropagation()
              }
            })
          }
        },
        {
          prop: 'fromShopName',
          label: '原门店名称',
          minWidth: 130
        },
        {
          prop: 'toAccountCode',
          label: '现业务账号编码',
          required: false,
          minWidth: 200,
          editRender: (h, row) => {
            return h('c-common-search-account-by-customer', {
              props: {
                value: row.toAccountCode,
                label: row.toAccountName,
                formatLabel: v => v.accountCode,
                disabled: !this.customerCode,
                customerCode: this.customerCode
              },
              on: {
                input: v => this.$set(row, 'toAccountCode', v),
                'update:label': v => this.$set(row, 'toAccountName', v)
              },
              nativeOn: {
                click: e => e.stopPropagation()
              }
            })
          }
        },
        {
          prop: 'toAccountName',
          label: '现业务账号名称',
          minWidth: 130
        },
        {
          prop: 'relationName',
          label: '新老商家关系',
          required: false,
          minWidth: 200,
          editRender: (h, row) => {
            return h('c-common-search-mdm', {
              props: {
                value: row.relationCode,
                label: row.relationName,
                custDocCode: 'QY066'
              },
              on: {
                input: v => {
                  this.$set(row, 'relationCode', v)
                  if ([6, '6'].includes(v)) {
                    this.$set(row, 'isTransferSales', '0')
                  }
                },
                'update:label': v => this.$set(row, 'relationName', v)
              },
              nativeOn: {
                click: e => e.stopPropagation()
              }
            })
          }
        },
        {
          prop: 'afterServiceAccountName',
          label: '售后问题负责人',
          required: false,
          minWidth: 200,
          editRender: (h, row) => {
            return h('c-common-search-mdm', {
              props: {
                value: row.afterServiceAccount,
                label: row.afterServiceAccountName,
                custDocCode: 'QY068'
              },
              on: {
                input: v => this.$set(row, 'afterServiceAccount', v),
                'update:label': v => this.$set(row, 'afterServiceAccountName', v)
              },
              nativeOn: {
                click: e => e.stopPropagation()
              }
            })
          }
        },
        {
          prop: 'reason',
          label: '交接原因',
          required: false,
          minWidth: 140,
          editRender: (h, row) => {
            return h('el-input', {
              props: {
                value: row.reason,
                placeholder: '请输入',
                clearable: true,
                type: 'textarea',
                autosize: { minRows: 1 }
              },
              attrs: {
                placeholder: '请输入',
                clearable: true,
                type: 'textarea',
                autosize: { minRows: 1 }
              },
              on: {
                input: v => {
                  this.$set(row, 'reason', v)
                }
              },
              nativeOn: {
                click: e => e.stopPropagation()
              }
            })
          }
        },
        {
          prop: 'isTransferSales',
          label: '销量是否转让',
          required: false,
          minWidth: 140,
          editRender: (h, row) => {
            return h('c-dict-select', {
              props: {
                value: row.isTransferSales,
                dictTypeCode: 'BOOLEANS',
                appCode: 'slm',
                domainCode: 'marketing',
                clearable: true,
                placeholder: '请输入',
                disabled: [6, '6'].includes(row.relationCode)
              },
              attrs: {
                clearable: true
              },
              on: {
                input: v => this.$set(row, 'isTransferSales', v)
              },
              nativeOn: {
                click: e => e.stopPropagation()
              }
            })
          },
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'BOOLEANS'
          }
        },
        {
          prop: 'rebatepRoblemName',
          label: '返利对象',
          required: false,
          minWidth: 200,
          editRender: (h, row) => {
            return h('c-common-search-mdm', {
              props: {
                value: row.rebatepRoblem,
                label: row.rebatepRoblemName,
                custDocCode: 'QY068'
              },
              on: {
                input: v => this.$set(row, 'rebatepRoblem', v),
                'update:label': v => this.$set(row, 'rebatepRoblemName', v)
              },
              nativeOn: {
                click: e => e.stopPropagation()
              }
            })
          }
        },
        {
          prop: 'isContinuePromotion',
          label: '是否延续促销活动',
          required: false,
          minWidth: 140,
          editRender: (h, row) => {
            return h('c-dict-select', {
              props: {
                value: row.isContinuePromotion,
                dictTypeCode: 'BOOLEANS',
                appCode: 'slm',
                domainCode: 'marketing',
                clearable: true,
                placeholder: '请选择'
              },
              attrs: {
                clearable: true
              },
              on: {
                input: v => this.$set(row, 'isContinuePromotion', v)
              },
              nativeOn: {
                click: e => e.stopPropagation()
              }
            })
          },
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'BOOLEANS'
          }
        },
        {
          prop: 'isTransferBalance',
          label: '余额是否转让',
          required: false,
          minWidth: 140,
          editRender: (h, row) => {
            return h('c-dict-select', {
              props: {
                value: row.isTransferBalance,
                dictTypeCode: 'BOOLEANS',
                appCode: 'slm',
                domainCode: 'marketing',
                clearable: true,
                placeholder: '请选择'
              },
              attrs: {
                clearable: true
              },
              on: {
                input: v => this.$set(row, 'isTransferBalance', v)
              },
              nativeOn: {
                click: e => e.stopPropagation()
              }
            })
          },
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'BOOLEANS'
          }
        },
        {
          prop: 'isTransferDeposit',
          label: '经营保证金是否转让',
          required: false,
          minWidth: 140,
          editRender: (h, row) => {
            return h('c-dict-select', {
              props: {
                value: row.isTransferDeposit,
                dictTypeCode: 'BOOLEANS',
                appCode: 'slm',
                domainCode: 'marketing',
                clearable: true,
                placeholder: '请选择'
              },
              attrs: {
                clearable: true
              },
              on: {
                input: v => this.$set(row, 'isTransferDeposit', v)
              },
              nativeOn: {
                click: e => e.stopPropagation()
              }
            })
          },
          propEnum: {
            domainCode: 'marketing',
            appCode: 'slm',
            dictTypeCode: 'BOOLEANS'
          }
        }
      ]
    }
  },
  computed: {
    comAddHook() {
      return this.isAudit ? this.addHook : undefined
    }
  },
  watch: {
    type: {
      handler(v) {
        this.setRequired(v === 'edit')
      },
      immediate: true
    }
    // officeCode: {
    //   handler() {
    //     this.tableData.forEach(e => {
    //       const t = 'fromCustomerCode fromCustomerName fromAccountCode fromAccountName fromShopCode fromShopName'.split(' ')
    //       t.forEach(k => {
    //         this.$set(e, k, '')
    //       })
    //     })
    //   }
    // }
  },
  methods: {
    setRequired(required) {
      Object.values(requiredKeys).forEach(v => {
        const tmp = this.setting.find(e => e.label === v)
        if (tmp) {
          this.$set(tmp, 'required', required)
        }
      })
    },
    validate() {
      this.hiddenColumn.forEach(k => { delete requiredKeys[k] })
      const errMsgs = []
      for (let i = 0; i < this.tableData.length; i++) {
        const item = this.tableData[i]
        // 必填
        for (const [k, msg] of Object.entries(requiredKeys)) {
          const v = item[k]
          if (v === undefined || v === null || v === '') {
            errMsgs.push(`【${this.title}】第${i + 1}行【${msg}】必填(选)!`)
          }
        }
      }
      if (errMsgs.length > 0) {
        this.$message({
          type: 'warning',
          message: errMsgs.join('<br>'),
          dangerouslyUseHTMLString: true
        })
        return Promise.reject(errMsgs)
      }
      return Promise.resolve(this.tableData)
    },
    addHook(row) {
      const t = this.tableData.find(e => !!e.fromCustomerCode)
      if (t) {
        this.$set(row, 'fromCustomerCode', t.fromCustomerCode)
        this.$set(row, 'fromCustomerName', t.fromCustomerName)
      }
      return row
    }
  }
}
</script>
